<template>
  <div id="div_setMeun">
    <el-row class="background">
      <el-col :span="4">
        <el-menu :default-active="active" :unique-opened="true" class="el-menu-vertical-demo" style="min-height:700px;">
          <el-submenu v-for="(item, index) in submenu" :key="index" v-if="item.children !== ''" :index="item.id">
            <template slot="title">
              <i :class="item.menu_icon"></i> {{ item.menu_name }}
            </template>
            <el-menu-item v-for="(subitem, index) in item.children" :key="index" :index="subitem.menu_url"
                          @click="enterMenuUI(subitem.menu_url)"><i :class="subitem.menu_icon"></i> {{ subitem.menu_name
              }}
            </el-menu-item>
          </el-submenu>
          <el-menu-item v-for="(subitem, index) in submenu" :key="index" v-if="subitem.children === ''"
                        :index="subitem.menu_url" @click="enterMenuUI(subitem.menu_url)"><i
            :class="subitem.menu_icon"></i> {{ subitem.menu_name }}
          </el-menu-item>
        </el-menu>
      </el-col>
      <el-col :span="18">
        <router-view></router-view>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  import { postDataToServer } from '../../assets/js/post.js'
  import { getMenuData } from '../../assets/file/setMenuData.js'

  export default {
    name: 'div_setMeun',
    data () {
      return {
        menuList: {},
        infotype: '',
        type: '',
        submenu: [],
        active: '',
      }
    },
    created () {
      // this.infotype = this.$store.state.user_type;
      this.getUserInfo()
    },
    methods: {
      getUserInfo () {
        let _this = this
        let path = ''
        postDataToServer('ACCOUT_BASEINFO').then((data) => {
          if (data.status === 0) {
            _this.infotype = data.type
            this.submenu = getMenuData(this.infotype)
          }
        })
      },
      enterMenuUI (path) {
        this.$router.push({'path': path})
      },
    },
  }
</script>
<style scoped>
  .button {
    margin-top: 10em;
    margin-left: 0.5em;
  }

  .border {
    margin: 0.3em;
  }

  .el-menu-item {
    height: 50px;
    line-height: 50px;
  }

  .background {
    background-color: #FAFAFA;
  }
</style>
